<script>
  import $ from '../dfish.js'
  import {
    h,
    mergeProps
  } from 'vue'
  import WidgetBase from './WidgetBase.vue'
  import SrcParent from './SrcParent.vue'

  export default {
    name: 'w-tr',
    pubParentName: 'w-tbody,w-thead',
    mixins: [WidgetBase, SrcParent],
    props: ['rowIndex', 'cells', 'folder', 'src', 'success', 'filter', 'error', 'complete'],
    inject: ['table', 'providePubParent', 'provideInBody', 'provideLeafLevel', 'provideParentLeaf'],
    provide() {
      return (this.template || this.preload) ? {} : {
        provideParentLeaf: this,
        provideLeafLevel: this.provideLeafLevel + 1,
        provideParentExpanded: false,
      }
    },
    methods: {
      hasChild() {
        return $.hasChild(this.$slots, 'rows')
      },
      getInitLoaded() {
        return this.loaded = this.hasChild() || ((this.x || this.$props).folder === false) || !this.getSrc() ? true :
          false
      },
      isExpanded() {
        return this.x.expanded
      },
      isFolder() {
        return this.hasChild() ? true : this.x.folder != null ? this.x.folder : !!(this.getSrc() && !this.loaded)
      },
      isDisplay() {
        if (!this.provideParentLeaf) return true
        let p = this
        while (p = p.provideParentLeaf) {
          if (!p.isExpanded()) return false
        }
        return true
      },
      toggle(exp, fn) {
        this.x.expanded = exp != null ? exp : !this.x.expanded
        if (this.isExpanded() && !this.loaded) {
          this.request(() => {
            fn && fn(this.isExpanded())
          })
        } else {
          fn && this.$nextTick(() => {
            fn(this.isExpanded())
          })
        }
      },
      onmouseenter(e) {
        this.el().classList.add('z-hv')
      },
      onmouseleave(e) {
        this.el().classList.remove('z-hv')
      },
      html_slots() {
        let ri = this.rowIndex
        let rs = this.pubParent.rows
        let ci = 0
        return this.slots_children().map(td => {
          if (rs[ri] && rs[ri][ci]) {
            ci += rs[ri][ci]
          }
          td.dfishColIndex = ci
          if (td.props) {
            if (td.props.rowspan > 1) {
              for (let j = 1, r; j < td.props.rowspan; j++) {
                r = rs[ri + j] || (rs[ri + j] = {})
                r[ci] = $.number(td.props.colspan) || 1
              }
            }
            if (td.props.colspan > 1) ci += td.props.colspan - 1
          }
          ci++;
          return td
        })
      },
      html() {
        return this.$slots.rows ? [this.html_self(true), this.$slots.rows()] : this.html_self()
        // return [
        //   h('tr', mergeProps(this.html_attrs, this.$attrs, this.html_props), this.html_cells()),
        //   this.$slots.rows ? this.$slots.rows() : []
        // ]
      },
    },
    computed: {
      tagName() {
        return 'tr'
      },
      isEscape() {
        return this.pubParent.x.escape
      },
      inCurrent() {
        return this.pubParent.inCurrent(this)
      },
      html_props() {
        if (this.provideInBody) {
          return {
            class: {
              'z-on': this.inCurrent,
              'f-hide': !this.isDisplay()
            },
            onmouseenter: this.onmouseenter,
            onmouseleave: this.onmouseleave
          }
        }
        
      }
    }

  }
</script>
